<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>构建镜像</title>
  <link rel="stylesheet" type="text/css" href="../../js/layer/css/layui.css">
  <style>
    .zhanshop-form-label{
      float: left;
      width: 100%;
      text-align: left;
      line-height: 2.2em;
      color: #4d5259;
    }
    .text-pink{
      color: #f00;
    }
    .zhanshop-select{
      height: 38px;
      width: 100%;
      padding-left: 10px;
      padding-right: 10px;
      background: #fff;
      border: 1px solid #dddddd;
    }
    .layui-table{
      text-align: left;
    }
  </style>
</head>
<body>

<form class="layui-form" id="view">
  <div class="layui-tab layui-tab-brief" lay-filter="test-hash" style="text-align: center !important; position: relative;">
    <ul class="layui-tab-title" id="step-title" style="display: none;">
      <li class="layui-this" id="layui-tab0" lay-id="11">使用Dockerfile构建应用镜像</li>
    </ul>
    <div style="height: 40px; width: 100%; position: absolute; top: 0px;"></div>
    <div class="layui-tab-content" style="padding-left: 10px; padding-right: 10px;">
      <div class="layui-tab-item layui-show">
        <div class="demo-reg-container">

          <div class="layui-form-item">
            <label class="zhanshop-form-label"><b class="text-pink">*</b>名称</label>
            <div class="layui-input-wrap">
              <input id="name" type="text" name="name" value="" lay-verify="required" placeholder="请输入镜像名称" autocomplete="off" class="layui-input" >
            </div>
          </div>

          <div class="layui-form-item">
            <label class="zhanshop-form-label"><b class="text-pink">*</b>版本</label>
            <div class="layui-input-wrap">
              <input id="version" type="text" name="version" value="" lay-verify="required" placeholder="请输入镜像版本" autocomplete="off" class="layui-input" >
            </div>
          </div>

          <div class="layui-form-item">
            <label class="zhanshop-form-label"><b class="text-pink">*</b>Dockerfile</label>
            <div class="layui-input-wrap">
              <textarea rows="20" placeholder="请输入使用Dockerfile构建应用镜像的构建内容" name="Dockerfile" lay-verify="required" class="layui-textarea"></textarea>
            </div>
          </div>

          <div class="layui-form-item">
            <label class="zhanshop-form-label"><b class="text-pink"></b>复制数据</label>
            <div class="layui-inline" style="float: left; width: 30%;">
              <div class="layui-input-inline" style=" width: 100%;">
                <select name="volumes" lay-ignore style="width: 100%; height: 38px; background: #fff; border: #ddd 1px solid;">
                  <option value="">请选择</option>
                  {{#  arr_foreach(d.volumes, function(k1, v1){ }}
                  <option value="{{v1.name}}">{{v1.name}}</option>
                  {{#  }); }}
                </select>
              </div>
            </div>
            <div class="layui-inline"  style="float: left; width: 60%;">
              <label class="layui-form-label" style="text-align: left;">复制到镜像</label>
              <div class="layui-input-inline layui-input-wrap" style=" width: 50%;">
                <input name="mount" type="text"  autocomplete="off" placeholder="请输入复制到的目录位置如 /var/www" class="layui-input">
              </div>
            </div>
          </div>

          <div class="layui-form-item">
            <button type="button" lay-submit lay-filter="from-submit" class="layui-btn layui-btn-sm">确&nbsp;&nbsp;&nbsp;认</button>
          </div>
        </div>
      </div>

    </div>
  </div>
</form>
<script src="../../js/layer/layui.js"></script>
<script>
  ready(function() {
    layui.use(['zhanshop'], function(){
      $ = layui.$;
      zhanshop = layui.zhanshop;
      form = layui.form;
      var menuId = 'Cloudapp';//parent.layui.zhanshop.getParam('_id');

      zhanshop.view(API_ADDRESS +apiUrlTable+ '/' + menuId, '#view', function(data) {

      }, 'POST', {"_method":"addfrom"});

      // 提交事件

      form.on('submit(from-submit)', function(data){

        var submitData = data.field; // 获取表单字段值
        submitData["_method"] = 'dockerfile';
        // 我这里不要走json了
        layui.zhanshop.ajax(API_ADDRESS+apiUrlTable+'/Cloudimages', 'POST', submitData, {}, function(res){
          return layui.zhanshop.alert('操作成功', 'success', function(){
            parent.window.location.reload();
          });
        },function(xhr){
          return layui.zhanshop.alert(xhr.responseJSON.msg ? xhr.responseJSON.msg : xhr.statusText, 'danger');
        }, true, apiFromJson);
        return false; // 阻止默认 form 跳转

      });
    });
  });
</script>
</body>
</html>